<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8"%>
<!-- struts的tag(標籤) 固定用法 -->
<%@ taglib uri="/struts-tags" prefix="s"%>
<!-- 小日曆用的tag 固定用法-->
<%--@ taglib uri="/calendar-tag" prefix="cal"--%>
<!-- 數字欄位用的tag 固定用法-->
<%--@ taglib uri="/number-tag" prefix="num"--%>
<!-- 翻頁用的tag 固定用法-->
<%--@ taglib uri="/pageControl-tags" prefix="pc"--%>



<html xmlns="http://www.w3.org/1999/xhtml">
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
		<title>共用 Tag 範例頁面</title>
		<link rel="stylesheet" type="text/css" href="<s:url value="/base/css/utility.css" />" />
		<script type="text/javascript" src="<s:url value="/base/script/jquery.js" />"></script>
		
		<!-- Calendar Tag 的元件  -->
		<link rel="stylesheet" type="text/css" href="<s:url value="/base/css/calendar.css" />" />
		<script type="text/javascript" src="<s:url value="/base/script/taglib/calendar.js"/>"></script>
		
		<!-- Number Tag 的元件 -->
		<script type="text/javascript" src="<s:url value="/base/script/taglib/number.js"/>"></script>
		
		<!-- 翻頁 Tag 的元件 -->
		<link rel="stylesheet" type="text/css" href="<s:url value="/base/css/pageControl.css" />" />
		<script src="<s:url value="/base/script/taglib/pageControl.js" />"></script>
		<script src="<s:url value="/base/script/taglib/trMove.js" />"></script>
					
		<script>

		</script>
	</head>
	<body>
		<fieldset>
			<legend> 小日曆 Tag </legend>
			<form name="calendarForm" id="calendarForm">
				<table width="100%" border="1">
					<tr>
						<td width="10%"> 範例 </td>
						<td width="80%">
							<cal:calendar name="applyDate" id="applyDate" value="" dateType="ROC" title="申請日期" />
						</td>
					</tr>
					<tr>
						<td> 語法 </td>
						<td>
							&lt;cal:calendar name="產出物件名稱" id="產出物件代號" value="預設值" dateType="ROC 或 AD" isToday="true 或 false" showIcon="true 或 false" /&gt;
						</td>
					</tr>
					<tr>
						<td> Tag Lib. </td>
						<td>&lt;%@ taglib uri="/calendar-tag" prefix="cal"%&gt;</td>
					</tr>
					<tr>
						<td> JS </td>
						<td>
							&lt;script type="text/javascript" src="&lt;s:url value="/base/script/jquery.js" /&gt;"&gt;&lt;/script&gt;<br/>
							&lt;link rel="stylesheet" type="text/css" href="&lt;s:url value="/base/css/calendar.css" /&gt;" /&gt;<br/>
							&lt;script type="text/javascript" src="&lt;s:url value="/base/script/taglib/calendar.js"/&gt;"&gt;&lt;/script&gt;
						</td>
					</tr>
					<tr>
						<td> 資料來源 </td>
						<td colspan="2">無</td>
					</tr>
				</table>
			</form>
		</fieldset>
		<br/>
		<fieldset>
			<legend> 數字型態 Tag </legend>
			<form name="numberForm" id="numberForm">
				<table width="100%" border="1">
					<tr>
						<td width="10%"> 範例 </td>
						<td width="80%">
							靠左登打：<num:number name="num" id="numLeft" value="" title="數量" />，
							靠右登打(千分位)：<num:number name="num" id="numRight" value="" title="數量" textAlign="right" formatNumber="true"/>
						</td>
					</tr>
					<tr>
						<td> 語法 </td>
						<td>
							&lt;num:number name="產出物件名稱" id="產出物件代號" value="預設值" textAlign="靠左或靠右登打" formatNumber="是否加入千分位"/&gt;
						</td>
					</tr>
					<tr>
						<td> Tag Lib. </td>
						<td>&lt;%@ taglib uri="/number-tag" prefix="num"%&gt;</td>
					</tr>
					<tr>
						<td> JS </td>
						<td>
							&lt;script type="text/javascript" src="&lt;s:url value="/base/script/taglib/number.js"/&gt;"&gt;&lt;/script&gt;
						</td>
					</tr>
					<tr>
						<td> 資料來源 </td>
						<td colspan="2">無</td>
					</tr>
				</table>
			</form>
		</fieldset>
		<br/>
		<fieldset>
			<legend> 翻頁 Tag </legend>
				<table width="100%" border="1">
					<tr>
						<td width="10%"> 範例 </td>
						<td width="80%">
							<s:if test="queryList.size>0">
								<pc:pageControl id="query" pageSize="4" list="queryList" pageControlType="tr" pageControlDisplayType="link" deleteFunction="remove();" printFunction="print();" >
									<span>
										<table width="100%">
											<tr>
												<th width="4%"><input type="checkbox" id="checkAll_query" name="checkAll_query" onclick="checkAll('query', this);"/></th>
												<th>A</th>
												<th>B</th>
												<th>C</th>
											</tr>
											<s:iterator id="queryList" value="queryList" status="cStatus">
												<s:set name="row" value="#cStatus.index" />
												<pc:tr id="query" row="${row}">
													<td align="center">
														<input type="checkbox" id="checkDelete_query" name="checkDelete_query" value="<s:property value="#queryList.getUnit()" />;<s:property value="#queryList.getCodeIdm()" />;<s:property value="#queryList.getCodeIdd()" />" onclick="deleteCheck('query');"/>
													</td>
													<td align="center">
														<s:property value="#queryList[0]" />
													</td>
													<td align="center">
														<s:property value="#queryList[1]" />
													</td>
													<td align="center">
														<s:property value="#queryList[2]" />
													</td>
												</pc:tr>
											</s:iterator>
										</table>
									</span>
								</pc:pageControl>
							</s:if>
							<s:else>
								<font color="red">查無資料，請重新查詢。</font>
							</s:else>
						</td>
					</tr>
					<tr>
						<td> 語法 </td>
						<td>
							&lt;pc:pageControl id="query" pageSize="每頁筆數" list="資料集" pageControlType="tr" pageControlDisplayType="link 或 botton" deleteFunction="刪除時呼叫 JS Function;" printFunction="列印時呼叫 JS Function;" &gt;
							<br/>
							&lt;pc:tr id="query" row="記錄索引"&gt; 
						</td>
					</tr>
					<tr>
						<td> Tag Lib. </td>
						<td>&lt;%@ taglib uri="/pageControl-tags" prefix="pc"%&gt;</td>
					</tr>
					<tr>
						<td> JS </td>
						<td>
							&lt;script src="&lt;s:url value="/base/script/taglib/pageControl.js" /&gt;"&gt;&lt;/script&gt;
							<br/>
							&lt;script src="&lt;s:url value="/base/script/taglib/trMove.js" /&gt;"&gt;&lt;/script&gt;
						</td>
					</tr>
					<tr>
						<td> 資料來源 </td>
						<td colspan="2">無</td>
					</tr>
				</table>
		</fieldset>
		<br/>
	</body>
</html>